function chartMain(id,option){
    this.id = id;
    this.option = option;
}

chartMain.prototype.draw = function(){
    var theme = this.option.theme;
    var chart = echarts.init(document.getElementById(this.id),theme);
    chart.setOption(this.getOption(this.option));
}

chartMain.prototype.getOption = function(){
    var cOption = this.option;
    var type = cOption.type;
    if(type === 'pie'){
        return this.generateJsonPie();
    } else if(type === 'bar') {
        return this.generateJsonBar();
    } else if(type == 'line') {
        return this.generateJsonLine();
    }
}

chartMain.prototype.generateJsonPie = function(){
    var jsonData = {
        type:'pie',
        title:{
            text:this.option.title
        },
        tooltip: {
            trigger: 'item',
            formatter: "{a} <br/>{b}: {c} ({d}%)"
        },
        series:[
            {
                name:'访问来源',
                type:'pie',
                radius: ['50%', '70%'],
                avoidLabelOverlap: false,
                label: {
                    normal: {
                        show: false,
                        position: 'center'
                    },
                    emphasis: {
                        show: true,
                        textStyle: {
                            fontSize: '30',
                            fontWeight: 'bold'
                        }
                    }
                },       
                data:this.option.data
            }
        ]
    };
    return jsonData;
}

chartMain.prototype.generateJsonBar = function(){
    for(var i=0;i<this.option.series.length;i++){
        this.option.series[i].type = 'bar';
    }
    var jsonData = {
        title:{
            text:this.option.title
        },
        xAxis : [
            {
                type : 'category',
                data : this.option.xAxis,
                axisTick: {
                    alignWithLabel: true
                }
            }
        ],
        yAxis : [
            {
                type : 'value'
            }
        ],
        series : this.option.series
    };   
    return jsonData; 
}

chartMain.prototype.generateJsonLine = function(){
    for(var i=0;i<this.option.series.length;i++){
        this.option.series[i].type = 'line';
    }
    var jsonData =  {
        title: {
            text: this.option.title
        },
        tooltip: {
            trigger: 'axis'
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            data: this.option.xAxis
        },
        yAxis: {
            type: 'value'
        },
        series: this.option.series
    };
    return jsonData;
}